<template>
  <button @click="handleClick">发送页面</button>
</template>

<script setup>
import { onMounted, onBeforeUnmount, onUnmounted } from "vue";
import { sendMessage, numberCount } from "./demo.js";
import piniaDtore from "../pinia的使用,pinia用来替代vuex/index";
import { useRouter } from "vue-router";
const router = useRouter();
const pinia = piniaDtore();
onMounted(() => {
  console.log(11111111111);
  //页面第二次加载时走beforeunload
  window.addEventListener("beforeunload", () => {
    console.log(2222222222);
    localStorage.setItem("beforeunload", "beforeunload");
  });
});

onBeforeUnmount(() => {
  localStorage.setItem("onBeforeUnmount", "onBeforeUnmount");
});
onUnmounted(() => {
  localStorage.setItem("onUnmounted", "onUnmounted");
});
const handleClick = () => {
  let number = +localStorage.getItem("&number");
  if (number > 0) {
    sendMessage({
      type: "demo",
      message: "我是发送者",
    });
  } else {
    const { href } = router.resolve({ path: "/demo2" });
    window.open(href, "_blank");
  }
};
</script>

<style scoped>
[v-cloak] {
  display: none;
}
.box {
  display: inline-block;
  width: 150px;
}
</style>
